<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>添加文章</title>
    <!-- Element UI CSS -->
    <!--<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">-->
    <!--本地CSS-->
    <link rel="stylesheet" href="css/index.css">
    <link rel="stylesheet" href="css/element.css">
</head>
<body>
<div id="app">
    <el-container>
        <el-header>
            <el-menu mode="horizontal" router>
                <el-menu-item index="/">
                    <strong class="text-primary">协同会议平台</strong>
                </el-menu-item>
                <el-menu-item style="float: right;" @click="logout">退出</el-menu-item>
            </el-menu>
        </el-header>

        <el-container style="height: 700px">
            <el-aside width="200px">

                <el-row class="sidebar-header" type="flex" align="middle">
                    <div class="demo-image__preview">
                        <a href="user_look.html">
                            <el-avatar style="width: 60px; height: 60px" src="img/avatar-6.jpg"></el-avatar>
                        </a>
                    </div>
                    <div>
                        <span style="margin-left:10px;font-size: 12px;font-weight: bold">小灰</span><br>
                        <span style="margin-left:10px;font-size: 12px;font-weight: bold">研发部</span>
                    </div>
                </el-row>

                <el-menu :default-openeds="['1', '2','3']" default-active="2-3">
                <!--<el-menu class="el-menu-vertical-demo" @open="handleOpen" @close="handleClose" :default-openeds="defaultOpeneds">-->

                    <a href="home.html">
                        <el-menu-item index="1">
                            <i class="el-icon-house"></i>
                            <span slot="title">主页</span>
                        </el-menu-item>
                    </a>

                    <el-submenu index="2">
                        <template slot="title">
                            <i class="el-icon-user"></i>
                            <span>用户列表</span>
                        </template>
                        <el-menu-item-group>
                            <a href="user.html"><el-menu-item index="2-1">查看用户</el-menu-item></a>
                            <a href="my_user.html"><el-menu-item index="2-2">我关注的用户</el-menu-item></a>
                            <a href="article.html"><el-menu-item index="2-3">发布文章</el-menu-item></a>
                            <a href="article_collect.html"><el-menu-item index="2-4">我的收藏</el-menu-item></a>
                        </el-menu-item-group>
                    </el-submenu>
                    <el-submenu index="3">
                        <template slot="title">
                            <i class="el-icon-office-building"></i>
                            <span>部门列表</span>
                        </template>
                        <el-menu-item-group>
                            <a href="department.html"><el-menu-item index="3-1">全部部门</el-menu-item></a>
                            <a href="meeting.html"><el-menu-item index="3-2">会议系统</el-menu-item></a>
                        </el-menu-item-group>
                    </el-submenu>
                </el-menu>
            </el-aside>

            <el-main>
                <h2>添加文章</h2>
                <el-form ref="form" :model="articleForm" label-width="80px">
                    <el-form-item label="标题">
                        <el-input v-model="articleForm.title" placeholder="文章标题"></el-input>
                    </el-form-item>
                    <el-form-item label="内容">
                        <el-input type="textarea" :rows="5" placeholder="请输入文章内容"
                                  v-model="articleForm.content"></el-input>
                    </el-form-item>
                    <el-form-item>
                        <el-row type="flex" justify="center">
                            <el-col :span="6">
                                <el-button type="primary" @click="onSubmit">发布</el-button>
                            </el-col>
                        </el-row>
                    </el-form-item>
                </el-form>
            </el-main>

        </el-container>

        <!-- Footer -->
        <el-row type="flex" justify="center">
            <p>&copy; 2025.Company <a href="#">协同会议平台</a></p>
        </el-row>

    </el-container>
</div>

<!-- JavaScript files -->
<script src="js/vue.min.js"></script>
<script src="js/element.js"></script>
<script>
    new Vue({
        el: '#app',
        data() {
            return {
                defaultOpeneds: ['1', '2', '3'],
                articleForm: {
                    title: '',
                    content: ''
                }
            };
        },
        methods: {
            logout() {
                // Logout logic here
                window.location.href = "index.html";
            },
            handleOpen(key, keyPath) {
                console.log(key, keyPath);
            },
            handleClose(key, keyPath) {
                console.log(key, keyPath);
            },
            onSubmit() {
                // Submit form logic here
                console.log('submit!');
                window.location.href = "article_add.html";
            }
        }
    });
</script>
</body>
</html>